<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  <title>Google Visualization API Sample</title>
  <script type="text/javascript" src="http://www.google.com/jsapi"></script>
  <script type="text/javascript">
    google.load('visualization', '1', {packages: ['corechart']});
    function drawVisualization() {
      var queryText = encodeURIComponent("select+col4%2C+count()+from+954346+where+col3+%3E%3D+'9%2F1%2F2011'+and+col3+%3C%3D+'9%2F8%2F2011'&qrs=+and+col4+%3E%3D+&qre=+and+col4+%3C%3D+&qe=+group+by++col4");
      google.visualization.drawChart({
        "containerId": "visualization_div",
        "dataSourceUrl": 'http://www.google.com/fusiontables/gvizdata?tq=',
        "query":"select Date, +col4%2C+count()+from+954346+where+col3+%3E%3D+'9%2F1%2F2011'+and+col3+%3C%3D+'9%2F8%2F2011'&qrs=+and+col4+%3E%3D+&qre=+and+col4+%3C%3D+&qe=+group+by++col4",
        "refreshInterval": 50,
        "chartType": "BarChart",
        "options": {
          "title":"Yearly Coffee Consumption by Country",
          "vAxis": {"title": "Year"},
          "hAxis": {"title": "Cups"}
        }
      });
    }

    google.setOnLoadCallback(drawVisualization);
  </script>
</head>
<body style="font-family: Arial;border: 0 none;">
  <div id="visualization_div" style="width: 600px; height: 400px;"></div>
</body>
</html>